<template>
        <el-menu
                mode="horizontal"
                background-color="#D73448"
                text-color="#fff"
                active-text-color="#fff"
                router="true"
        >
            <el-menu-item index="/qiantai"> 首页</el-menu-item>
            <el-menu-item index="/history"> 历史抽奖</el-menu-item>
            <el-sub-menu index="selfInfo">
                <template #title>你好，{{userInfo.username}}</template>
                <el-menu-item index="/Repassword">修改密码</el-menu-item>
                <el-menu-item index="2-2" @click="logout">退出</el-menu-item>
            </el-sub-menu>
            <el-menu-item index="/index" v-if="authoritys.length > 0"> 进入后台</el-menu-item>
            <!-- <el-menu-item><a href="#">进入后台</a></el-menu-item> -->
        </el-menu>
</template>

<script>

    export default {
        name: "Nav",
        data() {
            return {
                members: [], //成员
                userInfo: [],
            }
        },
        methods: {
            logout() {
                this.$axios.post("/logout").then(res => {
                    localStorage.clear()
                    sessionStorage.clear()
                    this.$store.commit("resetState")
                    this.$router.replace("/login")
                    location.reload()
                })
            },
        },
        computed: {
            authoritys() {
                return this.$store.state.menus.permList
            },
        },
        created() {
            this.$axios.get("/sys/userInfo").then(res => {
                this.userInfo = res.data.data
            })
        },
    };
</script>

<style scope>
    .el-menu.el-menu--horizontal{
        justify-content: flex-end;
    }
</style>


